.clear{display: block;width: 0;height: 0;overflow: hidden;clear: both;}

.cont{width: 1226px;margin: 0 auto;overflow: hidden;height:600px;display: flex;justify-content: space-between;}

.magnifier{padding: 10px;position: relative;width: 482px;}
.magnifier .s_box{width:482px;height: 482px;position: relative;}
.magnifier .s_box img{width:482px;height: 482px;}
.magnifier .s_box span{width: 130px;height: 100px;background: rgba(200,200,200,0.5);position: absolute;left:0;top:0;display: none;cursor:move;}

/* 遮罩层的样式，为了解决小滑块的抖动问题 */
.magnifier .s_box .mask{width:482px;height: 482px;position: absolute;left:0;top:0;margin: 0;}

.magnifier .b_box{width:482px;height: 482px;overflow: hidden;position: relative;display: none;position: absolute;right: -482px;top:10px;}
.magnifier .b_box img{width: 1200px;height: 900px;position: absolute;left:0;top:0;}

.magnifier .list{width:482px;padding: 0;list-style: none;margin:70px 10px;background: #f9f9f9;}
.magnifier .list li{float: left;margin: 0 20px;}
.magnifier .list li img{width: 100px;height: 100px;}

.goodsMsg{width: 550px;height: 424px;display: flex;flex-direction: column;justify-content: space-between;margin-top: 30px;}

.goodsMsg b{
    display: block;
    width: 90px;
    height: 30px;
    background: rgb(218, 62, 15);
    font-size: 14px;
    line-height: 30px;
    text-align: center;
    color: #fff;
}